<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="index.css">
    <script src="index.js"></script>
</head>
<body>
<!-- 大盒子 -->
<div class="box">
    <!-- 左侧按钮 -->
    <a href="javascript:;" class="left">&lt</a>
    <!-- 右侧按钮 -->
    <a href="javascript:;" class="right">&gt</a>
    <!-- 轮播图片 -->
    <ul class="imgs" >
        <li class="one">
            <a href="#"><img src="img/1.webp" alt=""></a>
        </li>
        <li class="two">
            <a href="#" ><img src="img/2.webp" alt=""></a>
        </li>
        <li class="three">
            <a href="#"><img src="img/3.webp" alt=""></a>
        </li>
        <li class="four">
            <a href="#"><img src="img/4.webp" alt="" class="rose"></a>
        </li>
        <li class="five">
            <a href="#"><img src="img/5.webp" alt=""></a>
        </li>
        <li class="six">
            <a href="#"><img src="img/6.webp" alt=""></a>
        </li>
    </ul>
    <!--小圆圈-->
    <ul class="list">
    </ul>
    <!--两个空盒子，实现左右两侧图片点击效果-->
    <div class="rights"></div>
    <div class="lefts"></div>
</div>
</body>
</html>
